Editing JavaScript

HTML mode has support for editing JavaScript in HTML documents. HTML mode can color keywords in JavaScript and automatically indents the code. There is also a separate JavaScript mode for editing external JavaScript documents, see below.

The support for editing JavaScript is not fully enabled by default. This because it is more convenient to have a few things disabled when you are not editing JavaScript. In the JavaScript preferences dialog you can change the default behavior. The following concern JavaScript:

Electric left braces
When checked, the left braces, {, will be electric like in C mode. That { is electric means that a carriage return will automatically be inserted and the next line will be indented when you type {. However, the braces only behaves in this way between SCRIPT tags (and STYLE tags when you are editing CSS). Outside SCRIPT and STYLE tags typing { always just inserts a {. By default the {'s are electric.

Electric right braces
When checked, the right braces, }, will be electric like in C mode. By default the }'s are electric.

Electric semicolon
When checked, the semicolons, ;, will be electric like in C mode. Just like the braces they are only electric between SCRIPT and STYLE tags. By default the ;'s are electric.

Color JavaScript keywords
If checked, keywords and comments in JavaScript will be colored. These keywords also include the event handlers. By default JavaScript keywords are not colored. Coloring of JavaScript keywords is not possible if 'simple coloring' is on.

Include event handlers in attribute dialog
When checked, the event handlers (onFocus onSelect etc.) will appear in the attribute dialog. By default event handlers are not included in the attribute dialog.

Color of JavaScript keywords
The color of keywords in JavaScript. Applies only if you choose to color JavaScript keywords. The default is magenta.

Color of JavaScript and CSS comments
The color of comments in JavaScript and CSS. Applies only if you choose to color JavaScript or CSS keywords. The default is red.

If you do not have an American keyboard, you may have to set two key bindings to be able to use the electric left and right braces. For example, on my Swedish keyboard { is shift-opt-8 and } is shift-opt-9. To use the electric braces I have to bind these keys with

bind '8' <so> htmlLeftBrace HTML
bind '9' <so> htmlRightBrace HTML

This is put in HTML's preference file, via the menu Config -> Current mode -> Edit prefs. Change your key bindings similarly if needed.

JavaScript mode

JavaScript mode is intended for editing of external JavaScript documents (suffix .js). It may also sometimes be a better choice when you are editing JavaScript inside an HTML document. Select JScr in the mode menu to manually switch to JavaScript mode.

The support in JavaScript mode is basically the same as within HTML mode: keyword coloring, indentation and electric braces and semicolons.

The func menu behaves differently in JavaScript mode. It lists all functions defined in the document and lets you quickly jump between them.

JavaScript has its own preferences, which you change via Config -> Current Mode -> Flags... while you are in JavaScript mode.

Just like in HTML mode, you may have to set two key bindings if you do not have an American keyboard, to be able to use the electric left and right braces. For example, on my Swedish keyboard { is shift-opt-8 and } is shift-opt-9. To use the electric braces I have to bind these keys with

bind '8' <so> electricLeft JScr
bind '9' <so> electricRight JScr

This is put in JavaScript's preference file, via the menu Config -> Current mode -> Edit prefs. Change your key bindings similarly if needed.